"Poner canción en » Facebook Twitter Patatabrava"
"Poner canción en » Facebook Twitter Patatabrava"
Noteboek |
|
▼ |
Información de autor en las entradas |
|
▼ |
Suprimimos el nombre de autor del post-footer.
Información de autor con enlaces.
Añadimos los estilos para conseguir algo similar a la siguiente imagen:
Justo antes de ]]></b:skin> añadimos:
.datos-autor { /* contenedor información */
-moz-border-radius:5px;
background-color:#884062; /* color de fondo contenido */
border-color:#000; /* color borde */
border-style:solid;
border-width:1px;
margin-top:-30px;
margin-bottom:40px;
padding:5px;
}
.avatar-img img { /* imagen avatar */
-moz-border-radius:5px;
background-color:#000; /* color fondo */
float:left;
margin-right:10px;
margin-top:20px; }
.info-autor { /* texto información */
color:#fff; /* color texto */
font-size:12px;
line-height:1.4em;
margin-left:5px;
padding-right:5px;
text-transform:none;margin-bottom:15px;
}
.info-autor h3 { color:#eee !important; /* color título */
font-size:17px; /* tamaño de fuente */
font-weight:bold;
margin-left:50px;
margin-top:5px;
text-shadow:0px 1px 0 #000; /* sombra texto */
text-transform:none;
}
.info-autor a:link, .texto-autor a:visited { /* estilos enlaces */
-moz-border-radius:
5px;background-color:#ccc; /* fondo enlaces */
border:1px solid #000; /* borde color */
color:#000; /* color texto */
font-size:12px; /* tamaño fuente */
line-height:2.2em;
font-weight:bold;
padding:0 6px 0 7px;
text-shadow:1px 1px 0 #676767;
text-transform:none;
}
.info-autor a:hover { /* efecto hover enlaces */
color:#ccc;
font-weight:bold;
text-decoration:none;
text-shadow:1px 1px 0 #000;
}
o puede que lo tengamos definido de esta otra forma:
<div id='post-footer'>
Si por el contrario deseamos mostrar la información justo después de los datos de post-footer buscaremos:
<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:post.author == "Nombre-autor"'>
<div class='datos-autor'>
<div class='avatar-img'><img alt='' height='70' src='url-avatar' width='55'/>
</div>
<div class='info-autor'>
<h3>Título (Sobre autor)</h3>
<div align='justify'>
<p>Información de autor</p>
<p>Links: <span class='link-autor'>
<a href='Url-enlace1' target='_blank'>Enlace1</a>
<a href='Url-enlace2' target='_blank'>Enlace2</a>
<a href='Url-enlace3' target='_blank'>Enlace3</a>
</span></p>
</div></div></div>
</b:if></b:if>
Con eso ya tenemos lista la información en el blog pero podemos seguir jugando y añadir en lugar de los enlaces iconos a redes sociales:
Información de autor con iconos a redes sociales.
Filtro para comentarios spam |
|
▼ |
Hace algo menos de un mes en mi escritorio apareció un cartelito que decía se había habilitado la detención automática de spam en algunos blogs.
Según Blogger Buz es un filtro anti spam que nos ayudará a limpiar nuestro blog de comentarios indeseados.
Dice el refrán que más vale tarde que nunca y es muy cierto, por fin tengo habilitada esa función y sólo queda ver si es tan efectivo como se espera.
Texto con fondo de color sobre imagen |
|
▼ |
/* Sin color */
ul { overflow: hidden; padding: 5px; }
ul > li {
position: relative;
float: left;
list-style: none;
margin: 0 20px 20px 0;
font-size: 10px;
}
ul a { text-decoration: none; display: block; }
ul li img { display: block; position: relative; z-index: -1; } /* IE8 fix, background colour appears behind img for uknown reason set negative z-index */
ul li:not([class=na]) img { position: static; } /* Reset relative position, as this plays havoc with good browsers */
ul a:hover, ul a:focus { display: block; outline: none; -moz-box-shadow: 3px 3px 5px #000; -webkit-box-shadow: 3px 3px 5px #000; box-shadow: 3px 3px 5px #000; }
ul a:hover img, ul a:focus img { outline: 3px solid #ccc; }
ul a:hover:after,
ul a:focus:after
{
content: attr(title);
color: #000;
position: absolute;
bottom: 0;
height: 30px;
line-height: 30px;
text-align: center;
font-weight: bold;
width: 100%;
background: rgb(255,255,255);
background: rgba(255,255,255,0.7);
background: -moz-linear-gradient(top, rgba(255,255,255,0.7), rgba(204,204,204,0.7)); /* Firefox 3.6+ */
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,0.7)), to(rgba(204,204,204,0.7))); /* Safari */
display: block;
text-shadow: 1px 1px 1px #fff;
}
ul a.reverse:hover:after,
ul a.reverse:focus:after { top: 0; right: 0; }
ul a.offset:hover:after,
ul a.offset:focus:after { top: 50%; margin-top: -15px; }
ul a.alternate01:hover:after,
ul a.alternate01:focus:after
{
top: 0;
width: 50%;
height: 100%;
line-height: normal;
text-align: left;
padding: 4px;
font-size: 12px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
/* Con color */
ul.color a:hover img, ul.color a:focus img { outline-color: #1E528C; }
ul.color a:hover:after,
ul.color a:focus:after
{
background: rgb(30,82,140);
background: rgba(30, 82, 140, 0.7);
background: -moz-linear-gradient(top, rgba(30, 82, 140, 0.7), rgba(43, 117, 200, 0.7)); /* Firefox 3.6+ */
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(30, 82, 140, 0.7)), to(rgba(43, 117, 200, 0.7))); /* Safari */
color: #fff;
text-shadow: 1px 1px 1px #000;
}
A continuación en un gadget de HTML añadimos:
<ul>
<li><a href="url-enlace" class="offset" title="Título"><img src="url-imagen" width="559" height="283" alt="Título" /></a></li>
</ul>
Si preferimos mostrar el fondo del texto y borde de color entonces debemos añadir la clase "color" para que adquiera los estilos establecidos.
<ul class="color">
<li><a href="url-enlace" class="offset" title="Título"><img src="url-imagen" width="559" height="283" alt="Título" /></a></li>
</ul>
❋En url-imagen añadimos la url de la imagen que vamos a mostrar.
❋Donde url-enlace es el lugar para añadir la url del sitio a enlazar.
❋Con width establecemos la anchura de la imagen y con heigh la altura.
❋Con text-shadow: 1px 1px 1px #000; modificamos la sombra del texto.
❋En color: #fff el color de texto.
❋Si añadimos a continuación font-size: 14px; aumentamos el tamaño de fuente.
❋Para el color de borde buscamos:
ul.color a:hover img, ul.color a:focus img { outline-color: #4682B4; }
❋A continuación el segundo background es el color de fondo:
ul.color a:hover:after,
ul.color a:focus:after
{
background: rgb(30,82,140);
background: rgba(30, 82, 140, 0.7);
Iconos sociales Picasso |
|
▼ |
Más fuentes gratuitas para descargar |
|
▼ |
http://www.broble.com/ | http://www.abstractfonts.com/ |
---|---|
http://www.showfont.net/ | http://1001freefonts.com/ |
Galería de imágenes II con CSS |
|
▼ |
Para los estilos localizamos ]]></b:skin> y justo antes añadimos:
/* Galería-footer----------------------------------------------- */.galería-footer {margin-top:5px;overflow:hidden;width:300px !important; /* ancho de la galería */}.galería-footer a {display:block;float:left;margin-right:5px; /* margen derecho */margin-top:1px;}.galería-footer a img {-moz-background-clip:border;-moz-background-inline-policy:continuous;-moz-background-origin:padding;background:#9BBFB7 none repeat scroll 0 0; /* color de fondo de imágenes */border:1px solid #A6A6A6; /* color borde de imágenes */margin:8px 3px; /* espacio entre imágenes y margenes de la galería */opacity:0.2; /* opacidad */padding:6px; /* espacio entre imágenes */}.galería-footer a img:hover {opacity:1; /* opacidad al pasar el cursor */}
A continuación en un gadget de HTML del footer añadimos:
<div class="galería-footer"><a href="#" title="foto1"><img alt="foto1" src="url-foto1"/></a><a href="#" title="foto2"><img alt="foto2" src="url-foto2"/></a><a href="#" title="foto3"><img alt="foto3" src="url-foto3"/></a><a href="#" title="foto4"><img alt="foto3" src="url-foto4"/></a><a href="#" title="foto5"><img alt="foto5" src="url-foto5"/></a><a href="#" title="foto6"><img alt="foto6" src="url-foto6"/></a><a href="#" title="foto7"><img alt="foto7" src="url-foto7"/></a><a href="#" title="foto8"><img alt="foto8" src="url-foto8"/></a><a href="#" title="foto9"><img alt="foto9" src="url-foto9"/></a></div>
❋ Donde url-foto1-2... añadimos la url de la imagen que mostramos en la galería.
❋ En a href="#" sustituimos la almohadilla por la url del enlace o imagen de mayor tamaño, también podemos mostrar una ventana modal como en el ejemplo.
❋ alt - Indica un texto alternativo.
❋ title - Texto que se muestra en un tooltip al pasar el mouse.
<a href="url-imagen-grande" rel="lytebox" title="foto1"><img style="width:70px; height:70px; "src="url-miniatura"/></a>
Imágenes embebidas |
|
▼ |
Imágenes vectoriales gratuitas |
|
▼ |
YouToArt estupendo sitio para descargar imágenes vectoriales gratuitas y de libre uso.
La propiedad text-shadow en enlaces |
|
▼ |
En Impressive Webs nos indican los pasos a seguir para añadir sombra con la propiedad text-shadow y como ejemplo proporcionan los siguientes estilos:
a:link, a:visited {
color: #aaa;
text-decoration: none;
font-size: 36px;
text-shadow: 1px 1px 1px #555;
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
}
a:hover {
color: #bbb;
}
a:active {
text-shadow: -1px -1px 1px #555;
position: relative;
top: 1px;
left: 1px;
}
body {
background:$bgcolor;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}
a:link {
color:$linkcolor;
text-decoration:none;
}
a:visited {
color:$visitedlinkcolor;
text-decoration:none;
}
a:hover {
color:$titlecolor;
text-decoration:underline;
}
<style type='text/css'>
a.one:link, a.one:visited {
line-height: 24px;
color: #aaa;
text-decoration: none;
font-size: 36px;
text-shadow: 2px 2px 1px #555;
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
text-align: center;
}
a.one:hover {
color: #bbb;
}
a.one:active {
text-shadow: 1px 1px 1px #555;
position: relative;
top: 1px;
left: 1px;
}
</style>
Y el enlace de la siguiente forma:<a href="url-enlace" onclick="return false;" class="one">Texto enlace</a>
Más texturas para fondo del blog |
|
▼ |
Imagen de fondo en movimiento |
|
▼ |
En herramientas marcamos sobre la varita para obtener selección difusa.
Cuando tenemos la imagen es el momento de pasar a la plantilla.
Nos situamos justo antes de </head> y añadimos los estilos:
<style type='text/css'>.
content {
width: 500px; /* ancho del contenido */
margin: 0px auto;
}
.scrollbg {background-image: url(url-imagen-fondo); /* imagen de fondo */
background-color: #000; /* color de fondo */
width: 550px; /* ancho imagen de fondo */
height: 150px; /* alto imagen de fondo */
}
.scrollbg img {
display: block;
}
</style>
La imagen que he creado para el ejemplo mide 550 X 150.
La de fondo puede ser una textura y la añadimos en scrollbg/url-imagen-fondo, el ancho lo modificamos en width y la altura en height.
En width de content, que es el bloque que contiene la imagen y el fondo también debemos añadir la misma anchura de la imagen con transparencia.
A continuación añadimos jquery/1.4.1/jquery.min.js si ya lo estamos utilizando omitimos este paso.
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js' type='text/javascript'/>
Ahora, copiamos el contenido del siguiente archivo y lo pegamos justo después.
Guardamos los cambios realizados y nos situamos en plantilla edición de HTML, allí editamos un nuevo gadget de HTML/Javascript y en su interior añadimos:
<div class='scrollbg' style='background-image: url(url-imagen-fondo)'>
<img src="url-imagen-texto-transparente" alt="" />
</div>
En url-imagen-fondo añadimos la misma url que anteriormente añadimos en los estilos.
En url-imagen-texto-transparente añadimos la url que creamos con fondo transparente.
Añadir efecto maqueta en las imágenes |
|
▼ |
Entrevista en Luz de Gas RadioBlog |
|
▼ |
❋Abacab en "Música" con: "Discos, música y reflexiones" Organizador del tradicional Concurso de Avatares
❋Sección Ayuda Blog con Lukas Thywalls
❋Leda dentro de "Cultura y Tendencias" con "Leda Luna de Invierno"
❋José R. Gonzalez en "Personal" con: The Greatest Hits"
❋Sección Cine con Davicine de: "No es cine todo lo que reluce"
❋Manuel Sánchez Acero en "Blogosfera" con: "Un universitario cualquiera"
❋Iker Jauregui de: "La Cúpula de la Ira" que participa en: "Humor"
❋ Gem@ BLOG participante en "Ciencia, Tecnología e Internet"
Gran menú con imágenes de fondo |
|
▼ |
Nos situamos en plantilla edición de html justo después de ]]></b:skin> y los añadimos:
<style type='text/css'>
* {margin:0;padding:0;}
.menuWrapper{
border:1px solid #000;
text-shadow:0 1px 1px #000;
font-style: normal;
font-weight: normal;
text-transform:uppercase;
letter-spacing: normal;
line-height: 1.45em;
position:relative;
margin:20px auto;
height:542px;
width:797px;
background-position:0 0;
background-repeat:no-repeat;
background-color:transparent; }
ul.menu{
padding: 0;
list-style:none;
width:797px; }
ul.menu > li{
float:left;
width:265px;
height:542px;
background-repeat:no-repeat;
background-color:transparent; }
ul.menu > li.last{
border:none; }
.bg1{
background-image: url(Url-imagen); }
.bg2{
background-image: url(Url-imagen); }
.bg3{
background-image: url(Url-imagen); }
ul.menu > li > a{
text-shadow:0 1px 1px #000;
border-bottom: 1px solid #000;
border-top: 1px solid #000;
float:left;
font-size: 21px;
width:268px;
height: 48px;
margin-top:450px;
text-align:center;
line-height:50px;
color:#ddd;
background-color:#333;
letter-spacing:1px;
cursor:pointer;
font-family: 'Tangerine', century gothic, verdana;
text-decoration:none;
}
ul.menu > li ul{
list-style:none;
float:left;
margin-top:-180px;
width:130%;
height:110px;
padding-top:10px;
background-repeat:no-repeat;
background-color:transparent; }
ul.menu > li ul li{
text-shadow:0 1px 1px #000;
display:none; }
ul.menu > li ul.sub1{
background-image:url(Url-imagen-transparente); }
ul.menu > li ul.sub2{
background-image:url(Url-imagen-transparente); }
ul.menu > li ul.sub3{
background-image:url(Url-imagen-transparente); }
ul.menu > li ul.sub1 {margin-left:0;}
ul.menu > li ul.sub2 {margin-left:0;}
ul.menu > li ul.sub3 {margin-left:0;}
ul.menu > li ul li a{
color:#fff;
text-decoration:none;
line-height:20px;
margin-left:20px;
text-shadow:0 1px 1px #000;
font-size:15px; }
ul.menu > li ul li a:hover{
border-bottom:1px dotted #fff; }
ul.menu > li ul.sub1 li{
display:block; }
</style>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'/>
<div class="menuwrapper bg1" id="menuwrapper">
<ul class="menu" id="menu">
<li class="bg1" style="background-position: 0pt 0pt;">
<a href="#" id="bg1">Título-1</a>
<ul class="sub1" style="background-position: 0pt 0pt;">
<li><a href="#">Submenu 1</a></li>
<li><a href="#">Submenu 1</a></li>
</ul>
</li>
<li class="bg1" style="background-position: -266px 0px;">
<a href="#" id="bg2">Título-2</a>
<ul class="sub2" style="background-position: -266px 0pt;">
<li><a href="#">Submenu 2</a></li>
<li><a href="#">Submenu 2</a></li>
</ul>
</li>
<li class="last bg1" style="background-position: -532px 0px;">
<a href="#" id="bg3">Título-3</a>
<ul class="sub3" style="background-position: -266px 0pt;">
<li><a href="#">Submenu 3</a></li>
<li><a href="#">Submenu 3</a></li>
</ul>
</li>
</ul>
</div>
Sidebar fija |
|
▼ |
Buscamos sidebar-wrapper y añadimos lo marcado en negrita:
#sidebar-wrapper {
margin-top:-5px;
margin-left: 640px;
position:fixed;
width: 220px;
float: right;
word-wrap: break-word;
overflow: hidden;
}
FontPark fuentes gratuitas |
|
▼ |
Wallpapers picalls |
|
▼ |
¿Quién fue nuestro primer seguidor en Twitter? |
|
▼ |
A estas alturas todos conocemos Twitter y es muy posible que tengamos bastantes seguidores pero resulta curioso averiguar quien fue esa primera persona que se hizo seguidor nuestro.
FirstFollower es una aplicación que nos permite averiguarlo, simplemente tenemos que acceder y añadir nuestro nombre de usuario,
¡Igual nos sorprendemos!
Imágenes efecto rollover con texto |
|
▼ |
Siguiendo el tema de días anteriores sobre mostrar texto oculto en una imagen otra vez hacemos uso de CSS y además de utilizar rollover también se utilizará la propiedad opacity.
Los estilos los podemos añadir en la plantilla antes de ]]></b:skin> pero debemos tener en cuenta que la imagen se añade en los estilos, es decir, que si vamos a utilizar este efecto en varias ocasiones con distinta imagen y distinto tamaño es conveniente añadir los estilos en la misma entrada cambiando el nombre de la clase.
Editamos nuestra entrada y añadimos el html que incluirá el texto:
<div class="rollover_img"><a title=""href="url-enlace-de-la-imagen">
<span> Texto...</span></a></div>
Al final de la entrada añadimos los estilos y la url de la imagen:
<style> .rollover_img {
width: 280px;
height: 150px;
background-image: url(url-imagen);
background-position: top;
-moz-border-radius:10px;
-webkit-border-radius:10px;
border:10px solid #ccc;
font:13px normal Arial, Helvetica, sans-serif;
line-height:18px;
float:left;
margin:0 10px 10px 0;
}
.rollover_img a {
color: #fff;
width: 280px;
height: 150px;
display: block;
text-decoration: none;
}
.rollover_img a:hover {
background:#000;
opacity:.60;
filter:alpha(opacity=60);
}
.rollover_img a span {
display: none;
width: 280px;
padding:5px;
}
.rollover_img a:hover span {
display: block;
}
</style>
Si observamos los estilos veremos que la imagen tiene width: 280px (ancho) y height: 150px (alto) si por ejemplo creamos otra entrada y deseamos añadir una imagen distinta lo que haremos será añadir el ancho de nuestra imagen en width y el alto en height.
El ancho del contenido lo encontremos en width de rollover_img a span.
También tendríamos que cambiar el nombre de la clase por uno distinto porque de lo contrario esa nueva imagen que añadimos adquiere los estilos que tenemos añadidos y se mostraría la misma imagen repetidas veces.
Si añadimos la imagen 1 en una entrada y en los estilos le pusimos rollover.
Para añadir una segunda imagen le ponemos otro nombre o una variante del mismo rolloverx.
Ese cambio lo haríamos en todos los estilos, así como cambiar el tamaño de la imagen.
Iconos pintados a mano |
|
▼ |
Efecto Pop-Up con CSS |
|
▼ |
Nata con fresas
(cuatro personas)
400 gramos de fresas.
200 gramos de azúcar.
1/2 litro de nata líquida.
1 limón.
Primero añadimos los estilos antes de ]]></b:skin>
/* Texto oculto */
ul.columns {
width: 240px; /* ancho de la columna*/
list-style: none;
margin: 0 auto;
padding: 0;
float: left;
}
ul.columns li {
width: 220px;
float: left;
display: inline;
margin: 10px;
padding: 0;
position: relative;
}
ul.columns li:hover {
z-index: 99;
}
ul.columns li img {
background:#000; /* color de fondo */
position: relative;
filter: alpha(opacity=30);opacity: 0.5; /* grado de opacidad */
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
}
ul.columns li:hover img{
z-index: 999;
filter: alpha(opacity=100);opacity: 1; /* opacidad al pasar el cursor */
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
ul.columns li .info {
position: absolute;
left: -5px; top: -10px;
padding: 210px 10px 20px;
width: 220px; /* ancho del texto */
display: none;
background: #000; /* color de fondo del texto */
font-size: 1.2em; /* Tamaño de fuente */
-webkit-border-radius: 5px; /* esquinas redondeadas */
-moz-border-radius: 5px; /* esquinas redondeadas */
border-radius: 5px; /* esquinas redondeadas */
color:#fff; /* color del texto */
}
ul.columns li:hover .info {
display: block;
}
ul.columns li h2 {
font-size: 15px; /* Tamaño del título */
font-weight:bold;
text-transform: uppercase;
margin: 0;
padding: 10px 0;
color:#fff; /* Color del título */
}
ul.columns li p {
padding: 0;
margin: 0;
font-size: 0.9em;
}
Luego, donde vamos a mostrar la imagen:
<div style=" margin: 10px auto; height: 200px; width: 200px;">
<ul class="columns"><li><a href="url-enlace"><img alt="" src="url-imagen" /></a>
<div class="info">
<h2>Título</h2>
Texto del contenido
</li></ul></div></div>
- En url-enlace añadimos la url del sitio si que deseamos enlazar, si no deseamos que sea un enlace eliminamos la línea: <a href="url-enlace">
- En url-imagen añadimos la url de nuestra imagen que para este ejemplo debe medir 220X200
- En Título añadimos el título, y en Texto del contenido, el texto.
Elegante Slideshow Animate Panning |
|
▼ |
Si nuestras medidas coinciden o simplemente deseamos probar el efecto la forma de añadirlo es la siguiente.
<script src='http://code.jquery.com/jquery-latest.js'/>
<script src='url-jquery.easing.1.3.js'/>
<script src='url-jquery.timer.js'/>
<script src='url-image-rotator.js'/>
Luego añadimos los estilos antes de ]]></b:skin>
*{margin:0; padding:0;}
#window{
clear:both;
width:960px;
height:350px;
background:#000;
overflow:hidden;
position:relative;
margin:10px auto 10px auto;
}
#slideshow{
width:1920px;
height:700px;
overflow:hidden;
position:relative;
}
#slideshow li{
width:960px;
height:350px;
float:left;
display:inline;
}
#content {
background:url(url-imagen-bubble.jpg) no-repeat scroll left top #131310;
color:#FFFFFF;
font-family:georgia,serif;
margin:0 auto 10px;
overflow:hidden;
padding-top:20px;
width:960px;
}
<div id="window">
<ul id="slideshow">
<li class="box1"><img src="imagen-1" alt="Imagen1"/></li>
<li class="box2"><img src="imagen-2" alt="Imagen2"/></li>
<li class="box3"><img src="imagen-3" alt="Imagen3"/></li>
<li class="box4"><img src="imagen-4" alt="Imagen4"/></li>
</ul>
</div>
¡ Ya podemos votar ! |
|
▼ |
Sorteo en Xakata Blog |
|
▼ |
Escribir un post sobre el sorteo en vuestro blog.
En el post se deben añadir dos enlaces uno para el texto noticias curiosas y otro a www.xakata.net
Finalmente, hay que dejar un comentario en la entrada que habla sobre el concurso con enlace al post, que será vuestro justificante de participación. Si no se deja el comentario no tendrá efecto la participación.
1er premio: Banner 480x60 px situado en la cabecera de xakata.net.
2º premio: Banner 480x60 px situado bajo el primer post.
3er premio: Favicon 16x16 px situado en la sobre el titulo del primer post. (sin zoom)
(NO se aceptan animaciones y otros efectos.)
Además solo por participar se consigue un espacio para nuestro favicon en www.adxense.com durante 12 meses.
La elección del ganador es totalmente aleatoria.
Cada participación se corresponderá con el nombre del blog.
El ganador se elegirá por coincidencia de su nombre de participación utilizando el sistema de sorteos online de Sortea2.
En ningún caso el premio podrá ser canjeable por dinero en efectivo u otros bienes.
¡¡ Felicidades por el aniversario y suerte a los participantes !!